<html>
    <head>
        
        <?php $this->load->view("movil/reservar_js"); ?>
        <link rel="stylesheet" href="<?php echo base_url();?>media/jqueryMobile/css/jquery3.css" /> 
        <script src="<?php echo base_url();?>media/jqueryMobile/js/jquery2.js"></script>
        <script src="<?php echo base_url();?>media/jqueryMobile/js/jquery1.js"></script>
        <script type="text/javascript"></script>
        <script>
            //reset type=date inputs to text
            $( document ).bind( "mobileinit", function(){
                $.mobile.page.prototype.options.degradeInputs.date = true;
            });	
            $(document).on({
                "mousedown touchstart": function () {
                $(this).siblings("input").trigger("start");
                },
                "mouseup touchend": function () {
                $(this).siblings("input").trigger("stop");
                }
            }, ".ui-slider");
        </script>

        
    </head>

<body>
<form>



    <div data-role="fieldcontain">
        <label for="especialidad">Especialidad</label>
        <select name="especialidad" id="especialidad">
              <?php              
              foreach($dataton as $data){
                  echo "<option value=".$data['id'].">".$data['nombre']."</option>";
              }
              ?>
        </select>
    </div>

    <div data-role="fieldcontain">
        <label for="slider-0">Fecha:</label>
        <input type="date" name="fechaini" value="" id="fechaini" placeholder='mm/dd/yyyy' />
    </div>

    <div data-role="fieldcontain">
        <label for="slider-1">Hora:</label>
        <input type="range" name="hora" id="hora" value="8" min="0" max="23" />

    </div>

    <div id="disponibilidad">
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <legend>Escoga una hora y doctor:</legend>
                <ul id="lista">
                    <li></li>
                </ul>            
            </fieldset>
        </div>
    </div>

    <input type="button" value="Reservar" id="Aceptar"  />
    
</form>
    
    <div data-role="page" id="nuevo">
        <div data-role="header">
            <h1>Advertencia</h1>
        </div>
        <div data-role="content">
            Ingrese los datos correctos
            <a href="#" data-role="button" data-rel="back">Aceptar</a>
        </div>
    </div>    
</body>
</html>
